<div class="nav-pf-vertical nav-pf-vertical-with-sub-menus    hidden-icons-pf   ">    {% load static %}
  <ul class="list-group">

    <li class="list-group-item">
      <a href="{% url 'index' %}">
        <span class="fa fa-dashboard" data-toggle="tooltip" title="Dashboard"></span>
        <span class="list-group-item-value">Dashboard</span>
      </a>
    </li>


    <li class="list-group-item  secondary-nav-item-pf" data-target="#ipsum-secondary">
      <a href="#0">
        <span class="fa fa-space-shuttle" data-toggle="tooltip" title="多级导航"></span>
        <span class="list-group-item-value">多级导航</span>
      </a>

        <div id="-secondary" class="nav-pf-secondary-nav">
            <div class="nav-item-pf-header">
                <a href="#0" class="secondary-collapse-toggle-pf" data-toggle="collapse-secondary-nav"></a>
                <span>二级导航</span>
            </div>
            <ul class="list-group">
                <li class="list-group-item  tertiary-nav-item-pf" data-target="#ipsum-intellegam-tertiary">
      <a href="#0">
        <span class="list-group-item-value">Intellegam</span>
      </a>

      <div id="compute-containers-tertiary" class="nav-pf-tertiary-nav">
  <div class="nav-item-pf-header">
    <a href="#0" class="tertiary-collapse-toggle-pf" data-toggle="collapse-tertiary-nav"></a>
    <span>三级导航</span>
  </div>
  <ul class="list-group">
    <li class="list-group-item ">
      <a href="#0">
        <span id="compute-containers-users-nav-item" class="list-group-item-value">Recteque</span>

      </a>
    </li>
    <li class="list-group-item">
      <a href="#0">
        <span id="compute-containers-groups-nav-item" class="list-group-item-value">Suavitate</span>

      </a>
    </li>
    <li class="list-group-item">
      <a href="#0">
        <span id="compute-containers-roles-nav-item" class="list-group-item-value">Vituperatoribus</span>

      </a>
    </li>
  </ul>
</div>


                </li>

                <li class="list-group-item">
                    <a href="#0">
                        <span class="list-group-item-value">Accumsan</span>

                    </a>
                </li>
            </ul>
        </div>
    </li>

      <li class="list-group-item">
      <a href="#0">
        <span class="fa fa-graduation-cap" data-toggle="tooltip" title="导航x"></span>
        <span class="list-group-item-value">导航</span>
      </a>
    </li>

      <li class="list-group-item supervisor_dj">
      <a href="{% url 'supervisor_list' %}">
        <span class="fa fa-graduation-cap" data-toggle="tooltip" title="导航x"></span>
        <span class="list-group-item-value">supervisor</span>
      </a>
    </li>

      <!-- 手机端显示 -->
      <li class="list-group-item secondary-nav-item-pf mobile-nav-item-pf visible-xs-block">
      <a href="#0">
        <span class="pficon pficon-user" data-toggle="tooltip" title="" data-original-title="User"></span>
        <span class="list-group-item-value">User</span>
      </a>
      <div id="user-secondary" class="nav-pf-secondary-nav">
        <div class="nav-item-pf-header">
          <a href="#0" class="secondary-collapse-toggle-pf" data-toggle="collapse-secondary-nav"></a>
          <span>User</span>
        </div>

        <ul class="list-group">
          <li class="list-group-item">
            <a href="#0">
              <span class="list-group-item-value">Preferences</span>
            </a>
          </li>

          <li class="list-group-item">
            <a href="#0">
              <span class="list-group-item-value">Logout</span>
            </a>
          </li>
        </ul>
      </div>
    </li>
      <li class="list-group-item secondary-nav-item-pf mobile-nav-item-pf visible-xs-block" data-target="#amet-secondary">
      <a href="#0">
        <span class="pficon pficon-help" data-toggle="tooltip" title="" data-original-title="Help"></span>
        <span class="list-group-item-value">Help</span>
      </a>
      <div id="help-secondary" class="nav-pf-secondary-nav">
        <div class="nav-item-pf-header">
          <a href="#0" class="secondary-collapse-toggle-pf" data-toggle="collapse-secondary-nav"></a>
          <span>Help</span>
        </div>
        <ul class="list-group">
          <li class="list-group-item">
            <a href="#0">
              <span class="list-group-item-value">Help</span>
            </a>
          </li>
          <li class="list-group-item">
            <a href="#0">
              <span class="list-group-item-value">About</span>
            </a>
          </li>
        </ul>
      </div>
    </li>
  </ul>
</div>